<template>
    <div class="main">
        我是第二层页面
    </div>

</template>

<script lang="ts" setup>
import _ from 'lodash-es'    

_.cloneDeep({})//深拷贝函数
_.throttle(()=>{},1000)//节流函数
_.debounce(()=>{},1000)//防抖函数

const resize =()=> {
    console.log("窗口尺寸发生变化",window.innerWidth)
}

window.addEventListener('resize', _.debounce(resize, 1000));//防抖函数  减少页面性能开销
// window.addEventListener('resize', resize);//一直打印


/**
 * 
 * @param x 数字千位符
 */
    //无小数点
const numberWithCommas = (x:number)=> {
    return console.log(x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, "."));
}
numberWithCommas(100000000000)

    //有小数点
const addThousandSeparator = (x:number) =>{
    if (!isNaN(x)) {
        var source = String(x).split(".");
        source[0] = source[0].replace(new RegExp('(\\d)(?=(\\d{3})+$)', 'ig'), "$1,");//只将整数部分进行都好分割
        return console.log(source.join("."));//再将小数部分合并进来
    } else {
        return x;
    }
}
addThousandSeparator(100000000000.123456789)




</script>
<style lang="scss" scoped>
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
.main{
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>